<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>345注册</title>
		<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1.0, user-scalable=no" />

		<link rel="stylesheet" href="css/simple-line-icons.css">
		<link rel="stylesheet" href="css/mui.min.css">
		<link rel="stylesheet" href="css/mui-ext.css">
		<script src="js/mui.min.js"></script>
		<script src="js/jquery-1.8.3.min.js"></script>
		<style>
			* {
				border: 0px;
				padding: 0px;
				margin: 0px;
				font-family: "黑体";
			}
		</style>
		<script src="js/md5.js"></script>
		<script src="js/utils/http.utils.js"></script>
		<script src="js/bus/pubfun.js"></script>
		<script type="text/javascript">
			//获取用户对应的微信详细 以及orgId
			var $orgId = localStorage.getItem("wxfwid");
			
			var $openId = getQueryString(window.location.search, "openid");
			var $appid = getQueryString(window.location.search, "appid");
			
			var $InterValObj; //timer变量，控制时间
			var $count = 60; //间隔函数，1秒执行
			var $curCount; //当前剩余秒数
			var $rePhone = /^1[3|4|5|8][0-9]\d{4,8}$/;

			//timer处理函数
			function SetRemainTime() {
				if($curCount == 0) {
					window.clearInterval($InterValObj); //停止计时器
					$("#iptCode").removeAttr("disabled"); //启用按钮
					$("#iptCode").html("重新获取");
				} else {
					$curCount--;
					$("#iptCode").html("重新获取 " + $curCount);
				}
			}
			
			function fun_ObtainCode() {
				var $telnumber = document.getElementById("iptTelNum").value;
				if($telnumber == "" || $telnumber == null) {
					mui.alert("请输入电话号码!");
					return;
				}

				if(!$rePhone.test($telnumber)) {
					mui.alert("手机号格式不正确，请重新输入！");
					return;
				}

				$curCount = $count;　　 //设置button效果，开始计时
				document.getElementById("iptCode").disabled = true;
				document.getElementById("iptCode").innerHTML = "重新获取 " + $curCount
				$InterValObj = window.setInterval(SetRemainTime, 1000); //启动计时器，1秒执行一次
				mui.ajax({
					url: $request_url.regCcodes,
					type: "post",
					headers: {
						"Authorization": $headers_authorization
					},
					data: {
						"mobile": $telnumber
					},
					dataType: "json",
					success: function(dat) {
						if(dat.code == 0) {
							localStorage.setItem("regCcode", dat.result.checkcode);
						} else {
							mui.toast(dat.message);
						}
					},
					error: function(e) {

					}
				});
			}

			function userReg() {
				var $telnumber = document.getElementById("iptTelNum").value;
				if($telnumber == "" || $telnumber == null) {
					mui.alert("请输入电话号码!");
					return;
				}

				if(!$rePhone.test($telnumber)) {
					mui.alert("手机号格式不正确，请重新输入！");
					return;
				}

				var $phone_codes = document.getElementById("ipt-input-code").value;
				if($phone_codes == "" || $phone_codes == null) {
					mui.alert("请输入手机验证码!");
					return;
				}

				if($phone_codes != localStorage.getItem("regCcode")) {
					mui.alert("输入的验证码有误!");
					return;
				}

				var $password = document.getElementById("ipt-password").value;
				if($password == "" || $password == null) {
					mui.alert("请输入密码!");
					return;
				}
				
				mui.ajax({
					url: $request_url.userReg,
					type: "post",
					data: {
						orgId: $orgId,
						mobile: $telnumber,
						checkcode: $phone_codes,
						password: hex_md5($password),
						inviteCode : "",
						userOpenId : $openId
					},
					headers: {
						"Authorization": $headers_authorization
					},
					dataType: "json",
					success: function(dat) {
						var $codes = dat.code;
						if($codes == 0) {
							mui.openWindow({
								url : "login.html"
							});
						} else {
							mui.toast(dat.message);
						}
					},
					error: function(e) {
						mui.toast("请求失败!");
					}

				});
			}
		</script>

	</head>

	<body style="width: 100%; background-color: white; text-align: center;">
		<div class="mui-content" style="background-color: white;" align="center">
			<div class="" style="margin-top: 30px;">
				<img src="img/login/logo_03.png" style="width: 90px;"/>
				<span style="color: #00A8C6; display: block;">家长无难事</span>
			</div>
			<input type="hidden" id="iptCodes"/>
			<div id="dv-login-up" style="margin-top: 20px" align="center">
				
				<div style="background-image: url(img/login/kuang_03.png); background-repeat: no-repeat; height: 42px; width: 290px; background-size: 100%;">
					<div style="padding-top: 6px; display: flex; width: 100%;">
						<span style="display: block; margin-left: 5px;"><img src="img/login/dianhua_03.png" style="width: 18px;" /></span>
						<span style="display: block; margin-left: -10px;">
							<input id="iptTelNum" type="tel" style="border: none; height: 24px; width: 90%; padding-left: 10px;" value="" placeholder="请输入手机号码">
						</span>
						<span style="width: 110px;">
							<button id="iptCode" onclick="fun_ObtainCode();" style="border: 0px; font-size: 13px; width: 84px;">获取验证码</button>
						</span>
					</div>
				</div>
				
				<div style="background-image: url(img/login/kuang_03.png); background-repeat: no-repeat; background-size: 100%; height: 42px; width: 290px; margin-top: 10px;">
					<div style="padding-top: 6px; display: flex; width: 100%;">
						<span style="display: block; margin-left: 5px;"><img src="img/reg/yanzhengma_03.png" style="width: 18px;" /></span>
						<span style="display: block; margin-left: -10px;">
							<input id="ipt-input-code" type="number" style="border: none; height: 24px; width: 90%; padding-left: 10px;" value="" placeholder="请输入4位验证码">
						</span>
					</div>
				</div>
				
				<div style="background-image: url(img/login/kuang_03.png); background-repeat: no-repeat; background-size: 100%; height: 42px; width: 290px; margin-top: 10px;">
					<div style="padding-top: 6px; display: flex; width: 100%;">
						<span style="display: block; margin-left: 5px;"><img src="img/login/mima_07.png" style="width: 18px;" /></span>
						<span style="display: block; margin-left: -10px;">
							<input id="ipt-password" type="password" style="border: none; height: 24px; width: 90%; padding-left: 10px;" value="" placeholder="请设置账号密码">
						</span>
					</div>
				</div>
				
				<div class="" style="height: 70px; border: 0px; margin-top: 30px;">
					<button id='btn_login' onclick="userReg();" type="button" style="border: 0px;">
						<img src="img/reg/zhucekuang_03.png" style="width: 260px;" />
					</button>
				</div>
			</div>
		
			<div class="" style="font-size: 13px; color: #909090;">
				<a href="login.html" id='go-login' style="color: #909090;">已注册，直接登录</a><br />
				<hr style="width: 120px; height: 1px; background-color: #DCDCDC; margin-top: 5px;" />
			</div>
		</div>
	</body>

</html>